<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
		<title>Insert title here</title>
		<script src="/js/vue.js"></script>
		<script src="/js/axios.js"></script>
		<script src="/js/qs.js"></script>
		<script src="//unpkg.com/element-ui@2.4.11/lib/index.js"></script>
		<style scoped>
			/* 在此定义当前页面css */
			@import url("//unpkg.com/element-ui@2.4.11/lib/theme-chalk/index.css");
		</style>
	</head>
	<body>
		<div style="margin-left: 15px; margin-top: 15px;" id="app">
			<!-- <el-tabs v-model="activeName" @tab-click="handleClick">
			<el-tab-pane label="用户管理" name="first">用户管理</el-tab-pane>
			<el-tab-pane label="配置管理" name="second">配置管理</el-tab-pane>
			<el-tab-pane label="角色管理" name="third">角色管理</el-tab-pane>
			<el-tab-pane label="定时任务补偿" name="fourth">定时任务补偿</el-tab-pane>
		</el-tabs> -->
			<el-menu :default-active="activeIndex" class="el-menu-demo" mode="horizontal" @select="handleSelect">
				<el-menu-item index="1">订单</el-menu-item>
				<!-- <el-menu-item index="2">订单</el-menu-item> -->
			</el-menu>
		</div>

		<div style="margin: 15px; height: 50px;" id="app1">
			<el-select @change="findchange()" style="width:  150px; display:block;  float: left;" v-model="value7" filterable placeholder="请选择">
				<el-option-group  v-for="group in options3" :key="group.label" :label="group.label" :value="group.value">
					<el-option v-for="item in group.options" :key="item.value" :label="item.label" :value="item.value">
					</el-option>
				</el-option-group>
			</el-select>

			<div style="display:block; margin-left: 20px;  float: left;" id="inputTheme">
				<div style="display:block; float: left; margin-top: 10px; line-height: 50px;">
					<i class="el-icon-search"></i>
				</div>
				<div style="display: block; float: left; margin-left: 10px;float: left;">
					<el-input style="width: 200px; cursor: pointer;" placeholder="请输入内容"  v-model="inputtheme">
						<el-button slot="append" @click="searchOrder()" style="width: 100px;">主题</el-button>
					</el-input>
				</div>
				<el-button type="primary" style="margin-left: 20px;" @click="addOrder">新建订单</el-button>

				<el-dialog title="新建订单"  width="60%"   :visible.sync="dialogFormVisible">

					<el-form :rules="rules" ref="form"  :model="form">
						<el-row :gutter="20">
							<el-col :span="12">
								<el-form-item label="主题:" required  prop="otitle"  :label-width="formLabelWidth">
									<el-input v-model="form.otitle" style="width: 400px;"></el-input>
								</el-form-item>
							</el-col>
							</el-row>
							<el-row :gutter="20">
							<el-col :span="12">
								<el-form-item label="对应客户:" required prop="customer" :label-width="formLabelWidth">
								<!-- :fetch-suggestions="querySearchAsync" -->
								<el-autocomplete v-model.trim="form.customer"  :fetch-suggestions="querySearchAsync"  placeholder="请输入内容" @select="handleSelect" v-on:change="loadAll()" v-on:click="loadAll">
								 <i slot="prefix" class="el-input__icon el-icon-search"></i>
								</el-autocomplete>
							</el-col>
							<el-col :span="12">
								<el-form-item label="分类:" :label-width="formLabelWidth">
									<el-select v-model="form.otype" placeholder="请选择">
										<el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value">
										</el-option>
									</el-select>
								</el-form-item>
							</el-col>
						</el-row>
						<el-row :gutter="20">
							<el-col :span="12">
								<el-form-item label="付款方式:" :label-width="formLabelWidth">
									<el-select v-model="form.orderpay" placeholder="请选择">
										<el-option v-for="item in optionspay" :key="item.value" :label="item.label" :value="item.value">
										</el-option>
									</el-select>
								</el-form-item>
							</el-col>
							<el-col :span="8">
									  <el-form-item label="创建时间:"    :label-width="formLabelWidth">
									  <el-date-picker type="date" disabled placeholder="选择日期" width="30%"  v-model="form.date1"  value-format="yyyy-MM-dd" ></el-date-picker>
									</el-form-item>
							</el-col>
						</el-row>
						<el-row :gutter="20">
							<el-col :span="12">
								<el-form-item label="总金额:"   :label-width="formLabelWidth">
										<el-input v-model="form.name" disabled style="width:80%;" autocomplete="off"></el-input>
								</el-form-item>
							</el-col>
							<el-col :span="12">
								<el-form-item label="最晚发货:"   required prop="date2" :label-width="formLabelWidth">
									<el-date-picker v-model="form.date2"  :picker-options="pickerOptions0"  align="right" type="date"  value-format="yyyy-MM-dd" placeholder="选择日期">
									</el-date-picker>
								</el-form-item>
							</el-col>
						</el-row>
						<el-row :gutter="20">
							<el-col :span="12">
								<el-form-item label="回款金额:" disabled :label-width="formLabelWidth">
										<el-input v-model="form.name" disabled style="width: 80%;" autocomplete="off"></el-input>
								</el-form-item>
							</el-col>
							<el-col :span="12">
								<el-form-item label="发货:" :label-width="formLabelWidth">
									<el-input v-model="form.finput" style="width:100px" disabled placeholder="发货情况"></el-input>
								</el-form-item>
							</el-col>
							<el-col :span="12">
								
							</el-col>
						</el-row>
						<el-row :gutter="20">
							<el-col :span="12">
								<!-- prop="uosign" --> 
								<el-form-item label="客户签约人:"    :label-width="formLabelWidth" required>
										<el-select v-model="form.osign" @clear="uosignto()" clearable filterable="" remote="" reserve-keyword placeholder="请输入关键词" :remote-method="osignremoteMethod" :loading="osignloading">
											<i slot="prefix" class="el-input__icon el-icon-search"></i>
											<el-option v-for="item in uosign" :key="item.value" :label="item.label" :value="item.value"> 
										</el-option>
										</el-select>
								</el-form-item>
							</el-col>
							<el-col :span="12">
								<el-form-item label="退货:" :label-width="formLabelWidth">
									<el-input v-model="form.tinput" style="width:100px" disabled placeholder="退货情况"></el-input>
								</el-form-item>
							</el-col>
						</el-row>
						<el-row :gutter="20">
							<el-col :span="16">
								<el-form-item label="状态:" prop="radiosatus" :label-width="formLabelWidth" required>
									<template>
										<el-radio v-model="form.radiosatus" label="1098">执行中</el-radio>
										<el-radio v-model="form.radiosatus" label="1099">结束</el-radio>
										<el-radio v-model="form.radiosatus" label="1100">意外终止</el-radio>
									</template>
								</el-form-item>
							</el-col>
						</el-row>
						<el-row :gutter="20">
							<el-col :span="12">
								<!-- prop="uitemv" -->
								<el-form-item label="所有者:"  :label-width="formLabelWidth" required>
									<el-select v-model="form.uid" @clear="uitemvto()" clearable filterable="" remote="" reserve-keyword placeholder="请输入关键词" :remote-method="uidremoteMethod" :loading="uidloading">
										<i slot="prefix" class="el-input__icon el-icon-search"></i>
										<el-option v-for="item in uitemv" :key="item.value" :label="item.label" :value="item.value"> 
									</el-option>
									</el-select>
								</el-form-item>
							</el-col>
							<el-col :span="12">
							
							</el-col>
						</el-row>
						<el-form-item label="订单明细:" :label-width="formLabelWidth">
							保存后方可编辑明细
						</el-form-item>
						<el-form-item label="备注:" :label-width="formLabelWidth">
							<el-input type="textarea" :rows="12" :autosize="{ minRows: 4 }" placeholder=""  v-model="form.textcommunication" style="width: 80%;"></el-input>
						</el-form-item>
						<hr style="border: 0.5px solid #EEEEEE;" />
						<el-row :gutter="20">
								<el-form-item label="收货人/地址:" :label-width="formLabelWidth" >
									<el-collapse v-model="activeNames" @change="handleChange">
										<el-collapse-item style="color: #0030CE;"  title="点击展开"  name="1">
											<span style="color: #333333;font-weight: 700;">收货人:</span>
											<hr style="border: 0.5px solid #EEEEEE;" />
											<el-row :gutter="20">
												<el-col :span="12">
												<el-form-item label="从联系人读取:" prop="custID"  :label-width="formLabelWidth">
													<el-select  @change="aa()"  @clear="uosign1to()" v-model="form.osign1" clearable filterable="" remote="" reserve-keyword placeholder="请输入关键词" :remote-method="osignremoteMethod1" :loading="osignloading1">
														<i slot="prefix" class="el-input__icon el-icon-search"></i>
														<el-option v-for="item in uosign1" :key="item.value" :label="item.label" :value="item.value"> <i slot="prefix" class="el-input__icon el-icon-search"></i>
													</el-option>
													</el-select>
												</el-form-item>
												</el-col>
											</el-row>
											<el-row :gutter="30" style="margin-top: 20px;">
												<el-col :span="12">
													<el-form-item label="或者填写姓名:" prop="custID"  :label-width="formLabelWidth">
															<el-input v-model="form.oconsignee"></el-input>
													</el-form-item>
												</el-col>
											</el-row>
												<el-row :gutter="30" style="margin-top: 20px;">
												<el-col :span="12">
													<el-form-item label="电话:" prop="custID"  :label-width="formLabelWidth">
															<el-input v-model="form.conphone"></el-input>
													</el-form-item>
												</el-col>
											</el-row>
											<span style="color: #333333;font-weight: 700;">收货地址:</span>
											<hr style="border: 0.5px solid #EEEEEE;" />
											<el-row :gutter="30" style="margin-top: 20px;">
												<el-col :span="24">
													<el-form-item label="地址:" prop="custID"  :label-width="formLabelWidth">
															<el-input v-model="form.contaddress" style="width: 80%;"></el-input>
													</el-form-item>
												</el-col>
											</el-row>
											<el-row :gutter="30" style="margin-top: 20px;">
												<el-col :span="12">
													<el-form-item label="邮编:" prop="custID"  :label-width="formLabelWidth">
															<el-input v-model="form.postcode"></el-input>
													</el-form-item>
												</el-col>
											</el-row>
										</el-collapse-item>
									</el-collapse>
								</el-form-item>
							</el-col>
						</el-row>
					</el-form>
					<div slot="footer" class="dialog-footer">
						<el-button @click="dialogFormVisible = false">取 消</el-button>
						<!-- dialogFormVisible = false -->
						<el-button type="primary" @click="submitForm('form')">保存</el-button>
					</div>
				</el-dialog>

			</div>
		</div>
		<!-- 表单 -->
		<div id="app3" ref="app3" style="margin-left: 10px;">
			<template>
				<el-table :data="tableData1" tooltip-effect="dark" border style="width: 100%;color: black;">
					<el-table-column type="selection" width="35" align="center">
					</el-table-column>
					
					<el-table-column prop="ID" label="ID" width="50" align="center">
					</el-table-column>
					<el-table-column prop="theme" show-overflow-tooltip label="主题" align="center">
					</el-table-column>
					<el-table-column prop="customer" show-overflow-tooltip label="对应客户" align="center">
					</el-table-column>
					<el-table-column prop="fire" label="总金额"  width="100" align="center">
					</el-table-column>
					<el-table-column prop="get" label="回款金额" width="100" align="center">
					</el-table-column>
					<el-table-column prop="fstutes" label="发货状态" align="center">
					</el-table-column>
					<el-table-column prop="stutes" label="状态" align="center">
					</el-table-column>
					<el-table-column prop="uname" label="所有者" align="center">
					</el-table-column>
					<el-table-column prop="statretime" label="开始时间" align="center">
					</el-table-column>
					<el-table-column fixed="right" label="操作"  align="center">
						<template slot-scope="scope">
							<el-tooltip content="Bottom center" placement="bottom">
								<div slot="content">订单视图</div>
								<i class="el-icon-document" style="margin: 0px 2px;font-size: 17px;" @click="orderView(scope.row.ID)"></i>
							</el-tooltip>
							<el-tooltip content="Bottom center" placement="bottom">
								<div slot="content">删除</div>
								<i class="el-icon-delete" style="margin: 0px 2px;font-size: 17px;" @click="deletenew(scope.row.ID)"></i>
							</el-tooltip>
							<!-- <el-tooltip content="Bottom center" placement="bottom">
								<div slot="content">编辑</div>
								<i class="el-icon-edit"  @click="updatehandleClick(scope.row.ID)" style="font-size: 17px;"></i>
							</el-tooltip> -->
							<el-dialog title="提示" :visible.sync="dialogDelete" width="30%" append-to-body>
								<span>你确定要删除吗？</span>
									<span slot="footer" class="dialog-footer">
									<el-button @click="dialogDelete = false">取 消</el-button>
									<el-button type="primary" @click="dialogDelete = false" v-on:click="Delete(scope.row.ID)" >确 定</el-button>
								</span>
							</el-dialog>
							<!-- <el-button @click="handleClick(scope.row)" type="text" size="small">查看</el-button>
							<el-button type="text" size="small">编辑</el-button> -->
						</template>
					</el-table-column>
				</el-table>
			</template>
			<!-- 分页 -->
			<div style="display: block; float: left; margin-left: 200px;">
				<el-pagination background @size-change="handleSizeChange" @current-change="handleCurrentChange" :current-page="currentPage4"
				 :page-sizes="[5, 6, 8,10]" :page-size="pages.pageSize" layout="total, sizes,prev, pager, next, jumper" :total="pages.total">
				</el-pagination>
			</div>
		</div>
		<script type="text/javascript">
			var orderlist = ${list
			};
			var pagejson = ${pagejson
			};
		</script>
		<!-- <script type="text/javascript" src="/../js/prosale/order.js">
			
		</script> -->
		<script>
			var Main = new Vue({
				el: "#app",
				data: {
					activeIndex: '1',
					activeIndex2: '1',
				},
				methods: {
					handleSelect(key, keyPath) {
						console.log(key, keyPath);
						if (key == 1) {
			
						}
					},
					list1: function() {
						alert(orderlist.oTitle);
			
					}
				}
			});
			
			var Main2 = {
				data() {
					return {
						options3: [{
							label: '状态',
							options: [{
								value: '0',
								label: '全部数据'
							},{
								value: '1098',
								label: '执行中'
							}, {
								value: '1099',
								label: '结束'
							}, {
								value: '1100',
								label: '意外中止'
							}, {
								value: '1096',
								label: '无退货'
							}, {
								value: '1095',
								label: '有退货'
							}]
						}/* , {
							label: '未结束',
							options: [{
								value: '未结束订单',
								label: '未结束订单'
							}, {
								value: '未尽收款订单',
								label: '未尽收款订单'
							}, {
								value: '未尽发货订单',
								label: '未尽发货订单'
							}]
						} */],
						
						value7:'',
						inputtheme: '',
						activeNames: [],
						radiosatus: [{
							required: true,
							message: '请选择状态',
							trigger: 'change'
						}],
						orderpay: '',
						dialogFormVisible: false,
						form: {
							otitle:'',//主题
							otype:'',//订单分类
							osign:'',//客户签约人
							osign1:'',//收货人
							name: '',
							region: '',
							date1:new Date(),//创建时间
							date2: '',//最晚发货时间
							delivery: false,
							type: [],
							resource: '',
							radiosatus: '1098',//订单状态
							textcommunication: '',
							finput: '',
							tinput: '',
							uid:'',//所有者
							remark: null,//备注
							orderId: '',//订单编号
							oconsignee:'',//收货人名字
							conphone:'',//收货人电话
							contaddress:'',//收货地址
							postcode:'',//邮编
							customer:'',//客户编号
							orderpay:'',//付款方式
						},
						 rules: {
							 otitle: [
					            { required: true, message: '请输入主题', trigger: 'blur' },
					          ],
					          customer:[
					        	{ required: true, message: '请选择客户', trigger: 'blur' },
					            { required: true, message: '请选择客户', trigger: 'change' }
					          ],
					          date1: [
					            {  required: true, message: '请选择创建日期', trigger: 'change' }
					          ],
					          date2: [
					            { required: true, message: '请选择最晚发货日期', trigger: 'change' }
					          ],
					          type: [
					            { type: 'array', required: true, message: '请至少选择一个活动性质', trigger: 'change' }
					          ],
					          resource: [
					            { required: true, message: '请选择活动资源', trigger: 'change' }
					          ],
					          uosign: [
					           { required: true, message: '签约人不能为空', trigger: 'blur' },
					           { required: true, message: '签约人不能为空', trigger: 'change' } 
					          ],
					          uitemv: [
						             { required: true, message: '所有者不能为空', trigger: 'blur' },
						          { required: true, message: '所有人不能为空', trigger: 'change' } 
						          ]
					        },
							
						options: [],
						pickerOptions0: {
							disabledDate(time) {
								return time.getTime() < Date.now() - 8.64e7;
							}
						},
						optionspay: [],
						/* 日期选择 */
						pickerOptions1: {
							disabledDate(time) {
								return time.getTime() > Date.now();
							},
							shortcuts: [{
								text: '今天',
								onClick(picker) {
									picker.$emit('pick', new Date());
								}
							}, {
								text: '昨天',
								onClick(picker) {
									const date = new Date();
									date.setTime(date.getTime() - 3600 * 1000 * 24);
									picker.$emit('pick', date);
								}
							}, {
								text: '一周前',
								onClick(picker) {
									const date = new Date();
									date.setTime(date.getTime() - 3600 * 1000 * 24 * 7);
									picker.$emit('pick', date);
								}
							}]
						},
						formLabelWidth: '120px',
						gettoday: new Date(),
						gettime: new Date(),
						prostarttoday: '',
						prosalettoday: '',
						paytoday: '',
						uosign:[],
						uosigns:[],
						osignloading: false,
						uosign1:[],
						uosigns1:[],
						osignloading1: false,
						uitemv: [],
						uitemvs: [],
						uidloading: false,
						contactes: [],
						custIDoptions: [{
							value: '选项1',
							label: '张三'
						}, {
							value: '选项2',
							label: '李四'
						}, {
							value: '选项3',
							label: '王五'
						}, {
							value: '选项4',
							label: '赵二'
						}],
						restaurants: [],
					}
				},
				methods: {
					
					p: function() {
						this.$refs.zyx.load = "new_file.html"
					},
					 handleChange(val) {
			        console.log(val);
			      },
				    //这个是列表的选择事件
				  handleSelect(item) {
				  		var contacts=[{con:item.label2,conlabel:item.conName}];
				        console.log("item:"+JSON.stringify(item) );
				        this.contacts=contacts;	
				        this.gdID=item.label1;
						var _this=this;
						axios.post("/sales/prosale/seleOrdercust",
							//参数转换
							Qs.stringify({'ID':item.label1},{arrayFormat: 'brackets'})
							//ajax请求成功的回调函数
							).then(function(v){					          				
							//将数据装换成界面显示
							_this.uosigns= v.data.cust.map(item => {
								return { value: item.ID, label: item.name };
							  });
							_this.uosign=_this.uosigns;
							_this.uosigns1= v.data.cust.map(item => {
								return { value: item.ID, label: item.name };
							  });
							  _this.uosign1=_this.uosigns1;
						}).catch(function(){
							alert("信息出错了");
						});							 
				      },
				  loadAll() {
				    // alert("dd");
				    var _this=this;
				  	axios.get("/sales/abroadsaleCustName",
				    {
				       	params: {
						custName:this.customer
				      }
				       	}
				       			//ajax请求成功的回调函数
				    ).then(function(response){					          				
				       	console.log("回调成功，获取了服务器端返回的值v");
				       	console.log(response.data);					           		
				       	_this.restaurants=response.data;
				       	}).catch(function(){
				       		alert("显示客户初始化数据出错了");
				       	});	//这个是数据的初始化
				      },
				   //这个是显示查询的数据
				  querySearchAsync(queryString, cb) {
				     	 
				         var restaurants = this.restaurants;				       
				         var results = queryString ? restaurants.filter(this.createStateFilter(queryString)) : restaurants;	
				       // alert( cb);
				         clearTimeout(this.timeout);
				         this.timeout = setTimeout(() => { 
				        	cb(this.restaurants);
				        }, 3000 * Math.random());							       
				         if(queryString==''){					       
				         	this.customer=null;
				         	this.loadAll();
				  			var restaurants = this.restaurants;				       
				  			var results = queryString ? restaurants.filter(this.createStateFilter(queryString)) : restaurants;	
				  			// alert(cb);
				  			clearTimeout(this.timeout);
				  			this.timeout = setTimeout(() => {
				  			cb(this.restaurants);
				  			}, 3000* Math.random());	
				         }
				       },
				     //这个是根据输入的内容筛选数据
				    createStateFilter(queryString) {
				     	  console.log("queryString2:"+queryString);
				     	  if(queryString!=null&&queryString!=" "){
				     		  this.customer=queryString;				    		  
				     	  }else{
				     		  this.customer=null; 
				     	  }					    	 
				     	  console.log("customer:"+this.customer);
				     	 // this.$options.methods.mounted();
				     	//  this.mounted();
				     	this.loadAll();
				         return (state) => {return (state.value.toLowerCase().indexOf(queryString.toLowerCase()) === 0);};
				       },
					   addOrder(){
						   var _this=this;
						  axios.post("/sales/prosale/addOrderpage",
						  		//参数转换
						  		//Qs.stringify(this.form,{arrayFormat: 'brackets'})
						  		//ajax请求成功的回调函数
						  		).then(function(v){					          				
						  		console.log("回调成功，获取了服务器端返回的值v");
						  		console.log(v.data.contact);
						  		//将数据装换成界面显示
								_this.uosigns= v.data.contact.map(item => {
							        return { value: item.ID, label: item.name };
							      });
						  		_this.uosign=_this.uosigns;
								_this.uosigns1= v.data.contact.map(item => {
							        return { value: item.ID, label: item.name };
							      });
								_this.contactes=v.data.contact;
								_this.uitemvs= v.data.userAll.map(item => {
							        return { value: item.ID, label: item.name };
							      });
								   _this.uitemv=_this.uitemvs;
								  _this.uosign1=_this.uosigns1;
								console.log(_this.uitemvs);
								_this.optionspay=v.data.opay;
								_this.options=v.data.otype;
								_this.form.uid=parseInt('${user.uId}') ;
								_this.dialogFormVisible = true;
						  }).catch(function(){
						  	alert("信息出错了");
						  });							 
					   },
					   //加载联系人
					   osignremoteMethod(query) {
						   var _this=this;
					        if (query !== '') {
					          this.osignloading = true;
					          setTimeout(() => {
					            this.osignloading = false;
					            this.uosign = _this.uosigns.filter(item => {
					              return item.label.toLowerCase()
					                .indexOf(query.toLowerCase()) > -1;
					            });
					          }, 200);
					        } else {
					          this.uosign = [];
					        }
					      },
						  //清除客户签约人
						  uosignto(){
							  var _this=this;
							  _this.uosign=_this.uosigns;
						  },
					      //加载收货联系人
					      osignremoteMethod1(query) {
					    	  var _this=this;
						        if (query !== '') {
						          this.osignloading1 = true;
						          setTimeout(() => {
						            this.osignloading1 = false;
						            this.uosign1 = _this.uosigns1.filter(item => {
						              return item.label.toLowerCase()
						                .indexOf(query.toLowerCase()) > -1;
						            });
						          }, 200);
						        } else {
						          this.uosign = [];
						        }
						      }, 
							    //清除客户签约人
							  uosign1to(){
								 var _this=this;
							  	 _this.uosign1=_this.uosigns1;
							  },
						      //加载界面所有者
					      uidremoteMethod(query) {
							   var _this=this;
						        if (query !== '') {
						          this.uidloading = true;
						          setTimeout(() => {
						            this.uidloading = false;
						            this.uitemv = _this.uitemvs.filter(item => {
						              return item.label.toLowerCase()
						                .indexOf(query.toLowerCase()) > -1;
						            });
						          }, 200);
						        } else {
						          this.uosign = [];
						        }
						      },
							   uitemvto(){
							  	var _this=this;
							  	 _this.uitemv=_this.uitemvs;
							  },
							  //通过联系人加载收货人和收货地址
						      aa:function() {
						    	 var _this=this;
						    	 console.log(_this);
						    	 console.log(_this.contactes);
						    	  _this.contactes.map(item => {
						        	  if(_this.form.osign1==item.ID){
						        		  _this.form.oconsignee=item.name;
						        	  		_this.form.conphone=item.phone;
						        	  		 _this.form.contaddress=item.address; 
						        	  			_this.form.postcode=item.code; 
						        	  }
								      });
					},
					
					//提交添加
					submitForm(form) {
						var _this=this;
					//验证方法
					this.$refs[form].validate((valid) => {
					if (valid) {
						//post提交数据
						axios.post("/sales/prosale/addorder",
							//参数转换
							Qs.stringify(
							this.form
							,{arrayFormat: 'brackets'})
							//	params:
							//ajax请求成功的回调函数
							).then(function(v){
							console.log("回调成功，获取了服务器端返回的值v");
							console.log(v);
							showAtRight('/sales/prosale/order');
							_this.dialogFormVisible = false;
					}).catch(function(){
						alert("出错了");
						_this.dialogFormVisible = false;
					}); 
					} else {
						console.log('error submit!!');
						return false;
					}
				});
			},
			//根据选择筛选数据
			findchange(){
				var pageSize= Max.pasSize;
				var statusid=null;
				var search=null;
				var _this=this;
				var main3= Main3;
				if(this.value7.toString()== "0"){
					window.location.hash='#/sales/prosale/order';
				}else{
					window.location.hash='#/sales/prosale/order?statusid='+this.value7;
					statusid=this.value7;
				}
				this.inputtheme='';
				$.ajax({
				      type: "post",
				      url: "/sales/prosale/order1",
				      data: {pageNum:1,pageSize:pageSize,statusid:statusid,search:search},
				      success: function (sdata) {
				    	  console.log("页数打印*****："+sdata);
						  console.log(main3.tableData1);
				    	  main3.tableData1=sdata.list;
				          main3.pages=sdata;
						  main3.currentPage4=sdata.pageNum;
				      }
				});
			},
			searchOrder(){
				var pageSize= Max.pasSize;
				var statusid=null;
				var search=null;
				var _this=this;
				var main3= Main3;
				//判断是否带条件;
				//判断是否根据条件筛选
				if(this.value7.toString()=='0'||this.value7.toString()==''){
					if(this.inputtheme==""){
						window.location.hash='#/sales/prosale/order'
					}
					else{
						window.location.hash='#/sales/prosale/order?search='+this.inputtheme;
						search=this.inputtheme;
					}
				}else{
					statusid=this.value7.toString();
					if(this.inputtheme==""){
						window.location.hash=window.location.hash.split('&')[0];
					}
					else{
						window.location.hash=window.location.hash.split('&')[0]+'&search='+this.inputtheme;
						search=decodeURI(this.inputtheme);
					}
				}
				$.ajax({
				      type: "post",
				      url: "/sales/prosale/order1",
				      data: {pageNum:1,pageSize:pageSize,statusid:statusid,search:search},
				      success: function (sdata) {
				    	  console.log("页数打印*****："+sdata);
						  console.log(main3.tableData1);
				    	  main3.tableData1=sdata.list;
				          main3.pages=sdata;
						  main3.currentPage4=sdata.pageNum;
				      }
				});
			},
			//获取条件参数的方法
			getParameters(statusid,search){
				var url= window.location.href;
				var url1= url.indexOf("?");
				if(url1!=-1){
					//this.complaintheme=decodeURI(url.substring(url1+1,url.length).split('&')[0].split('=')[1]);
					//截取每一个条件
					var urlcondition= url.substring(url1+1,url.length).split('&');
					for(var i=0;i<urlcondition.length;i++){
						
						if(urlcondition[i].split('=')[0]=="statusid"){
							statusid=decodeURI(urlcondition[i].split('=')[1]);
						}
						if(urlcondition[i].split('=')[0]=="search"){
							search=decodeURI(urlcondition[i].split('=')[1]);
						}
					}
				}
			},
			//重置表单
			 resetForm(formName) {
	        this.$refs[form].resetFields();
	      }	
				},
				mounted() {
				this.loadAll();
				    },
					mounted:function(){
						var url= window.location.href;
						var url1= url.indexOf("?");
						if(url1!=-1){
							//this.complaintheme=decodeURI(url.substring(url1+1,url.length).split('&')[0].split('=')[1]);
							//截取每一个条件
							var urlcondition= url.substring(url1+1,url.length).split('&');
							for(var i=0;i<urlcondition.length;i++){
								
								if(urlcondition[i].split('=')[0]=="statusid"){
									this.value7=decodeURI(urlcondition[i].split('=')[1]);
								}
								if(urlcondition[i].split('=')[0]=="search"){
									this.inputtheme=decodeURI(urlcondition[i].split('=')[1]);
								}
							}
						}
					}
			}
			var Ctor = Vue.extend(Main2);
			new Ctor().$mount('#app1');
			
			var Main3=new Vue({
				el: "#app3",
				data: {
					pagSize:5,
					deleteid:0,
					dialogDelete:false,
					tableData1: orderlist,
					pages: pagejson,
					tableData3: [{
						ID: '20161123',
						theme: 'sdfsdfsgdf',
						customer: '张三',
						fire: '10500.00',
						get: '9600.00',
						fstutes: '已发货',
						stutes: "执行中",
						uname: 'zyx',
						statretime: new Date().toLocaleDateString()
					}, {
						ID: '20160503',
						theme: 'sdfsdfsgdf',
						customer: '王小虎',
						fire: '500.00',
						get: '300.00',
						fstutes: '已发货',
						stutes: "执行中",
						uname: 'zyx',
						statretime: new Date().toLocaleDateString()
					}, {
						ID: '20160513',
						theme: 'sdfsdfsgdf',
						customer: '王虎',
						fire: '500.00',
						get: '300.00',
						fstutes: '已发货',
						stutes: "执行中",
						uname: 'zyx',
						statretime: new Date().toLocaleDateString()
					}, {
						ID: '20160903',
						theme: 'sdfsdfsgdf',
						customer: '王小虎',
						fire: '500.00',
						get: '300.00',
						fstutes: '已发货',
						stutes: "执行中",
						uname: 'zyx',
						statretime: new Date().toLocaleDateString()
					}, {
						ID: '20160903',
						theme: 'sdfsdfsgdf',
						customer: '王小虎',
						fire: '500.00',
						get: '300.00',
						fstutes: '已发货',
						stutes: "执行中",
						uname: 'zyx',
						statretime: new Date().toLocaleDateString()
					}],
					currentPage4: pagejson.pageNum,
				},
				methods:{
					formatDate1(time) {
						var date = new Date(time);
						return formatDate(date, 'yyyy-MM-dd hh:mm');
					},
					handleClick(row) {
						console.log(row);
						console.log(row.ID);
					},
					//删除
					deletenew(id){
						console.log(id);
						this.deleteid=id;
						this.dialogDelete = true;
					},
					
					orderView(id){
						var _this= this;
						window.open("/sales/prosale/orderView?id="+id);     
					},
					
					//修改
					updatehandleClick(id){
						console.log(id);
					},
					handleSelectionChange(val) {
						this.multipleSelection = val;
					},
					handleSizeChange(val) {
						Max.pasSize=val;
						var statusid=null;
						var search=null;
						var _this=this;
						//判断是否带条件;
						var url= window.location.href;
						var url1= url.indexOf("?");
						if(url1!=-1){
							//this.complaintheme=decodeURI(url.substring(url1+1,url.length).split('&')[0].split('=')[1]);
							//截取每一个条件
							var urlcondition= url.substring(url1+1,url.length).split('&');
							for(var i=0;i<urlcondition.length;i++){
								
								if(urlcondition[i].split('=')[0]=="statusid"){
									statusid=decodeURI(urlcondition[i].split('=')[1]);
								}
								if(urlcondition[i].split('=')[0]=="search"){
									search=decodeURI(urlcondition[i].split('=')[1]);
								}
							}
						}
						$.ajax({
						      type: "post",
						      url: "/sales/prosale/order1",
						      data: {pageNum:1,pageSize:val,statusid:statusid,search:search},
						      success: function (sdata) {
						    	  console.log("页数打印*****："+sdata);
						    	  _this.tableData1=sdata.list;
						          _this.pages=sdata;
								  _this.currentPage4=sdata.pageNum;
						      }
						});
					},
					handleCurrentChange(val) {
						//查询的行数
						var pageSize= Max.pasSize;
						var statusid=null;
						var search=null;
						var _this=this;
						//判断是否带条件;
						var url= window.location.href;
						var url1= url.indexOf("?");
						if(url1!=-1){
							//this.complaintheme=decodeURI(url.substring(url1+1,url.length).split('&')[0].split('=')[1]);
							//截取每一个条件
							var urlcondition= url.substring(url1+1,url.length).split('&');
							for(var i=0;i<urlcondition.length;i++){
								
								if(urlcondition[i].split('=')[0]=="statusid"){
									statusid=decodeURI(urlcondition[i].split('=')[1]);
								}
								if(urlcondition[i].split('=')[0]=="search"){
									search=decodeURI(urlcondition[i].split('=')[1]);
								}
							}
						}
						$.ajax({
						      type: "post",
						      url: "/sales/prosale/order1",
						      data: {pageNum:val,pageSize:pageSize,statusid:statusid,search:search},
						      success: function (sdata) {
						    	  console.log("页数打印*****："+sdata);
						    	  _this.tableData1=sdata.list;
						          _this.pages=sdata;
								  _this.currentPage4=sdata.pageNum;
						      }
						});
					},
					//获取条件参数的方法
					getParameters(statusid,search){
						var url= window.location.href;
						var url1= url.indexOf("?");
						if(url1!=-1){
							//this.complaintheme=decodeURI(url.substring(url1+1,url.length).split('&')[0].split('=')[1]);
							//截取每一个条件
							var urlcondition= url.substring(url1+1,url.length).split('&');
							for(var i=0;i<urlcondition.length;i++){
								
								if(urlcondition[i].split('=')[0]=="statusid"){
									statusid=decodeURI(urlcondition[i].split('=')[1]);
								}
								if(urlcondition[i].split('=')[0]=="search"){
									search=decodeURI(urlcondition[i].split('=')[1]);
								}
							}
						}
					},
					Delete(id){
						var _this= this;
						//post提交数据
							 axios.post("/sales/prosale/deleteorder",
								//参数转换
								Qs.stringify({
								'ID':_this.deleteid}
								,{arrayFormat: 'brackets'})
								//	params:
								//ajax请求成功的回调函数
								).then(function(v){
								console.log("回调成功，获取了服务器端返回的值v"); 
								console.log(v);
								showAtRight('/sales/prosale/order');
						}).catch(function(){
							alert("出错了");
						}); 
					}
				},
			})
		
		</script>

	</body>
</html>
